import React from 'react';
import ReactECharts from 'echarts-for-react';

export default function RentIncome({ data, style }) {
  const option = {
    title: { text: '租金收入情况', left: 'center', top: 10, textStyle: { color: '#00eaff', fontSize: 18, fontWeight: 700 } },
    tooltip: { trigger: 'axis' },
    grid: { left: 40, right: 20, top: 50, bottom: 30 },
    xAxis: {
      type: 'category',
      data: data.x,
      axisLabel: { color: '#fff' }
    },
    yAxis: {
      type: 'value',
      axisLabel: { color: '#fff' }
    },
    series: [
      {
        data: data.y,
        type: 'line',
        smooth: true,
        symbol: 'circle',
        symbolSize: 8,
        lineStyle: { color: '#a020f0', width: 3 },
        itemStyle: { color: '#a020f0' },
        areaStyle: { color: 'rgba(160,32,240,0.15)' }
      }
    ]
  };

  return (
    <div style={{ width: '100%', height: 180, ...style }}>
      <ReactECharts option={option} style={{ width: '100%', height: 180 }} />
    </div>
  );
} 